package com.study.compose.beta.view

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.module.compose.base.composable.CodeView
import com.module.compose.base.composable.Content
import com.module.compose.base.composable.ContentView
import com.module.compose.base.composable.Title
import com.study.compose.beta.R

@Composable
fun LayoutSample() {
    LazyColumn(
        Modifier
            .fillMaxSize()
            .padding(start = 15.dp, end = 15.dp)
    ) {
        item {
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .fillMaxHeight(),
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                ContentView {
                    Title(title = "Column(竖向布局)")
                    Content(
                        content =
                        """
                        //设置属性
                        modifier: Modifier = Modifier
                        //竖向展示控制
                        verticalArrangement: Arrangement.Vertical = Arrangement.Top
                        //横向展示控制
                        horizontalAlignment: Alignment.Horizontal = Alignment.Start
                        """.trimIndent()
                    )
                }
                Column(horizontalAlignment = Alignment.CenterHorizontally) {
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                        modifier = Modifier.size(width = 60.dp, height = 60.dp),
                    )
                    Spacer(modifier = Modifier.height(10.dp))
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                    )
                }

                CodeView(
                    code =
                    """
                    Column(horizontalAlignment = Alignment.CenterHorizontally) {
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                            modifier = Modifier.size(width = 60.dp, height = 60.dp),
                        )
                        Spacer(modifier = Modifier.height(10.dp))
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                        )
                    }
                    """.trimIndent()
                )

                ContentView {
                    Title(title = "Row(横向布局)")
                    Content(
                        content =
                        """
                        modifier: Modifier = Modifier,
                        horizontalArrangement: Arrangement.Horizontal = Arrangement.Start,
                        verticalAlignment: Alignment.Vertical = Alignment.Top,
                        """.trimIndent()
                    )
                }
                Row(
                    horizontalArrangement = Arrangement.Center,
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                        modifier = Modifier.size(width = 60.dp, height = 60.dp),
                    )
                    Spacer(modifier = Modifier.width(10.dp))
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                    )
                }

                CodeView(
                    code =
                    """
                    Row(
                        horizontalArrangement = Arrangement.Center,
                        verticalAlignment = Alignment.CenterVertically
                    ) {
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                            modifier = Modifier.size(width = 60.dp, height = 60.dp),
                        )
                        Spacer(modifier = Modifier.width(10.dp))
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                        )
                    }
                    """.trimIndent()
                )

                ContentView {
                    Title(title = "Box(层叠布局)")
                    Content(
                        content =
                        """
                        modifier: Modifier = Modifier,
                        contentAlignment: Alignment = Alignment.TopStart,
                        //用途不清楚
                        propagateMinConstraints: Boolean = false,
                        """.trimIndent()
                    )
                }

                Box(contentAlignment = Alignment.Center) {
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                        modifier = Modifier.size(width = 60.dp, height = 60.dp),
                    )
                    Image(
                        painter = painterResource(id = R.mipmap.icon_android),
                        contentDescription = null,
                        modifier = Modifier.size(width = 20.dp, height = 20.dp),
                    )
                }

                CodeView(
                    code =
                    """
                    Box(contentAlignment = Alignment.Center) {
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                            modifier = Modifier.size(width = 60.dp, height = 60.dp),
                        )
                        Image(
                            painter = painterResource(id = R.mipmap.icon_android),
                            contentDescription = null,
                            modifier = Modifier.size(width = 20.dp, height = 20.dp),
                        )
                    }
                    """.trimIndent()
                )
            }
        }
    }
}